import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { Table, Pagination, Button, Grid, Input, Feedback, Select, Tab } from '@icedesign/base';
import IceContainer from '@icedesign/container';
import DataBinder from '@icedesign/data-binder';
import cookie from 'react-cookies';
import axios from 'axios';
import {
  FormBinderWrapper as IceFormBinderWrapper,
  FormBinder as IceFormBinder,
} from '@icedesign/form-binder';

const { Row, Col } = Grid;
const Toast = Feedback.toast;
const TabPane = Tab.TabPane;

const session = cookie.load('sessionId');
@DataBinder({
  tableData: {
    url: 'http://39.105.21.199:8989/IPEvaluation/indexweightManage/showIndexweightList.do?sessionId='+ session,
  },
})

export default class TreeTable extends Component {
  static displayName = 'TreeTable';

  static propTypes = {};

  static defaultProps = {};

  constructor(props) {
    super(props);
    this.state = {
      current: 1,
      Data: [],
      zhibiaoname: '指标名称',
      weight: '权重数值',
      describe: '指标描述',
      submitdata: {},
      iwId: '',
      thirddata: [],
      seconddata: [],
      leveladddata1: {},
      leveladddata2: {},
      leveladddata3: {},

    };
  }

  handleChange = (current) => {
    this.setState({
      current,
    });
  };
  refreshFoo = () => {
    this.props.updateBindingData('tableData', {
      // ajax 参数参见：https://github.com/axios/axios
      // 当前接口不需要参数，在这里只是演示，可以打开 Devtool 的 network 面板查看做了什么
    });
  };
  getdata =() =>{
    const sessionid = cookie.load('sessionId');
    const url = 'http://39.105.21.199:8989/IPEvaluation/indexweightManage/showIndexweightList.do?';
    // const listurl = url + sessionid;
    const params = new URLSearchParams();
    params.append('iwType', '企业单位指标');
    params.append('sessionId', sessionid);
    axios.post(url, params).then((response) => {
      console.log(response);
      if (response.data.msg === 'LoginInvalidate') {
        this.props.history.push('/pagelogin');
      }
      // this.state.Data = response.data.data;
      this.setState({ Data: response.data.data });
      console.log('shguju3', this.state.Data);
      const level1 = response.data.data;
      for (let i = 0; i < level1.length; i++) {
        const name = level1[i].iwName;
        const ID = level1[i].iwSequence;
        const datastr = name + '_' + ID;
        this.state.seconddata.push(datastr);
        // console.log('一级指标', this.state.seconddata);
        const children = level1[i].children;
        // console.log('children', children.length);
        for (let j = 0; j < children.length; j++) {
          const n = children[j].iwName;
          const id = children[j].iwSequence;
          const str = n + '_' + id
          // console.log('str', str);
          this.state.thirddata.push(str);
          // console.log('二级指标', this.state.thirddata);
        }
      }
    }).catch((error) => {
      console.log(error);
    });
  }

  componentWillMount() {
    this.refreshFoo();
    this.getdata();
  }
  onRowClick = function (record, index, e) {
    console.log(record, index, e);
  };

  rowSelection = {
    onChange: function (selectedKeys) {
      console.log(selectedKeys);
    },
  };
  // getdata = () => {
  //   console.log('123');
  // };
  xiugai = (index, record) => {
    const iwWeight = record.iwWeight;
    const iwName = record.iwName;
    const iwDescribe = record.iwDescribe;
    const iwId = record.iwId;
    this.setState({ zhibiaoname: iwName });
    this.setState({ weight: iwWeight });
    this.setState({ describe: iwDescribe });
    this.setState({ iwId: iwId });
    // axios.post('http://39.105.21.199:8989/IPEvaluation/evaluateManage/userShowEvaluateList.do?sessionId=' + sessionid)
    //   .then((response) => {
    //   }).catch((error) => {
    //     console.log(error);
    //   });
  };
  delete = (index, record) => {
    const deleteurl = 'http://39.105.21.199:8989/IPEvaluation/indexweightManage/deleteIndexweight.do';
    console.log(record);
    const id = record.iwId;
    const params = new URLSearchParams();
    params.append('sessionId', session);
    params.append('oldiwId', id);
    axios.post(deleteurl, params).then((response) => {
      console.log(response);
      Feedback.toast.success('删除成功');
      this.getdata();
      // window.location.reload(true);
    }).catch((error) => {
      console.log(error);
      Toast.error('删除出错');
    });
  }
  renderOperations = (value, index, record) => {
    return (
      <div
        className="filter-table-operation"
        style={styles.filterTableOperation}
      >
        <Button onClick={this.xiugai.bind(this, index, record)} shape="text">
          选择修改
        </Button>
      </div>
    );
  };
  renderdelete = (value, index, record) => {
    return (
      <div
        className="filter-table-operation"
        style={styles.filterTableOperation}
      >
        <Button onClick={this.delete.bind(this, index, record)} shape="text">
          删除
        </Button>
      </div>
    );
  };
  onSubmit =(value) => {
    const iwId = this.state.iwId;
    const params = new URLSearchParams();
    params.append('sessionId', session);
    params.append('iwType', '企业单位指标');
    console.log(iwId);
    if (iwId === '') {
      Toast.error('请选择所要修改的指标');
    } else {
      const iwName = this.state.submitdata.zhibiaoxiugai;
      const iwDescribe = this.state.submitdata.describexiugai;
      const weight = this.state.submitdata.quanzhongxiugai;
      params.append('iwId', iwId);
      if (iwName !== 'undefined') {
        params.append('iwName', iwName);
      }
      if (iwDescribe !== 'undefined') {
        params.append('iwDescribe', iwDescribe);
      }
      if (weight !== 'undefined') {
        params.append('iwWeight', weight);
      }
      axios.post('http://39.105.21.199:8989/IPEvaluation/indexweightManage/updateIndexweight.do', params)
        .then((response) => {
          console.log(response);
          if (response.data.msg === 'RequestSuccess') {
            Feedback.toast.success('修改成功');
            this.getdata();
          }
        }).catch((error) => {
          console.log(error);
        });
    }
  };
  level1 =() => {
    //39.105.21.199:8989
    const addurl = 'http://39.105.21.199:8989/IPEvaluation/indexweightManage/insertIndexweight.do'
    const params = new URLSearchParams();
    params.append('sessionId', session);
    params.append('iwParentSeq', '0');
    params.append('iwType', '企业单位指标');
    const name = this.state.leveladddata1.yijizhibiao;
    const weight = this.state.leveladddata1.yijiweight;
    const describe = this.state.leveladddata1.yijidescribe;
    console.log(name);
    if (typeof (name) === 'undefined' || typeof (weight) === 'undefined' || typeof (describe) === 'undefined') {
      Toast.error('请填写完整再提交');
    } else {
      params.append('iwName', name);
      params.append('iwWeight', weight);
      params.append('iwDescribe', describe);
      console.log('URL', addurl + params);
      axios.post(addurl, params).then((response) => {
        console.log(response);
        Feedback.toast.success('添加一级指标成功');
        // window.location.reload(true);
        this.getdata();
      }).catch((error) => {
        console.log(error);
      });
    }
  }
  level2 =() => {
    const addurl = 'http://39.105.21.199:8989/IPEvaluation/indexweightManage/insertIndexweight.do';
    const params = new URLSearchParams();
    params.append('sessionId', session);
    const zhibiao = this.state.leveladddata2.selectlevel1
    const name = this.state.leveladddata2.erjizhibiao;
    const weight = this.state.leveladddata2.erjiweight;
    const describe = this.state.leveladddata2.erjidescribe;
    if (typeof (name) === 'undefined' || typeof (weight) === 'undefined' || typeof (describe) === 'undefined') {
      Toast.error('请填写完整再提交');
    } else {
      const num = zhibiao.split('_');
      const ips = num[1];
      params.append('iwType', '企业单位指标');
      params.append('iwParentSeq', ips);
      params.append('iwName', name);
      params.append('iwWeight', weight);
      params.append('iwDescribe', describe);
      axios.post(addurl, params).then((response) => {
        console.log(response);
        Feedback.toast.success('添加二级指标成功');
        // window.location.reload(true);
        this.getdata();
      }).catch((error) => {
        console.log(error);
      });
    }
  }
  level3 =() => {
    const addurl = 'http://39.105.21.199:8989/IPEvaluation/indexweightManage/insertIndexweight.do';
    const params = new URLSearchParams();
    params.append('sessionId', session);
    const zhibiao = this.state.leveladddata3.selectlevel2;
    const name = this.state.leveladddata3.sanjizhibiao;
    const weight = this.state.leveladddata3.sanjiweight;
    const describe = this.state.leveladddata3.sanjidescribe;
    if (typeof (name) === 'undefined' || typeof (weight) === 'undefined' || typeof (describe) === 'undefined') {
      Toast.error('请填写完整再提交');
    } else {
      const num = zhibiao.split('_');
      const ips = num[1];
      params.append('iwType', '企业单位指标');
      params.append('iwParentSeq', ips);
      params.append('iwName', name);
      params.append('iwWeight', weight);
      params.append('iwDescribe', describe);
      console.log('URL', addurl + params);
      axios.post(addurl, params).then((response) => {
        console.log(response);
        Feedback.toast.success('添加三级指标成功');
        // window.location.reload(true);
        this.getdata();
      }).catch((error) => {
        console.log(error);
      });
    }
  }
  onChange = (value) => {
    console.log('onchange', value);
    this.setState({ submitdata: value });
  }

  render() {
    const { tableData } = this.props.bindingData;
    // console.log('shuju', tableData);
    console.log('shuju2', this.state.Data);
    return (
      <div>
        <IceContainer title="选择修改指标">
          <Table
            dataSource={this.state.Data}
            // isLoading={this.state.Data.__loading}
            isTree
            primaryKey="iwId"
            rowSelection={{ onChange: () => {}, onSelect: function (selected, record, records) {
            } }}
          >
            <Table.Column title="评价标准" dataIndex="iwName" />
            <Table.Column title="权重" dataIndex="iwWeight" />
            <Table.Column
              title="操作"
              dataIndex="operation"
              width={150}
              cell={this.renderOperations}
            />
            <Table.Column
              title="删除指标"
              dataIndex="operation"
              width={150}
              cell={this.renderdelete}
            />
          </Table>
          <IceFormBinderWrapper
            value={this.state.submitdata}
          >
            <div>
              <Row wrap>
                <Col xxs={24} xs={12} l={8} style={styles.filterCol}>
                  <label style={styles.filterTitle}>指标名称</label>
                  <IceFormBinder>
                    <Input name="zhibiao" disabled placeholder={this.state.zhibiaoname} />
                  </IceFormBinder>
                </Col>
                <Col xxs={24} xs={12} l={8} style={styles.filterCol}>
                  <label style={styles.filterTitle}>修改指标</label>
                  <IceFormBinder name="zhibiaoxiugai">
                    <Input name="zhibiaoxiugai" />
                  </IceFormBinder>
                </Col>
              </Row>
              <Row wrap>
                <Col xxs={24} xs={12} l={8} style={styles.filterCol1}>
                  <label style={styles.filterTitle}>权重数值</label>
                  <Input name="quanzhong" disabled placeholder={this.state.weight} />
                </Col>
                <Col xxs={24} xs={12} l={8} style={styles.filterCol1}>
                  <label style={styles.filterTitle}>修改权重</label>
                  <IceFormBinder name="quanzhongxiugai">
                    <Input name="quanzhongxiugai" />
                  </IceFormBinder>
                </Col>
              </Row>
              <Row wrap>
                <Col xxs={24} xs={12} l={8} style={styles.filterCol1}>
                  <label style={styles.filterTitle}>指标描述</label>
                  <IceFormBinder>
                    <Input name="describe" disabled placeholder={this.state.describe} />
                  </IceFormBinder>
                </Col>
                <Col xxs={24} xs={12} l={8} style={styles.filterCol1}>
                  <label style={styles.filterTitle}>描述修改</label>
                  <IceFormBinder name="describexiugai">
                    <Input name="describexiugai" />
                  </IceFormBinder>
                </Col>
              </Row>
              <div
                style={{
                  textAlign: 'right',
                  marginLeft: '12px',
                }}
              >
                <Button
                  onClick={this.onSubmit}
                  type="primary"
                  style={{ marginLeft: '10px' }}
                >
                  确认修改
                </Button>
              </div>
            </div>
          </IceFormBinderWrapper>
        </IceContainer>
        <IceContainer title="一级指标添加">
          <IceFormBinderWrapper
            value={this.state.leveladddata1}
          >
            <div style={{ marginTop: '50px' }}>
              <Row wrap>
                <Col xxs={24} xs={12} l={6} style={styles.filterCol1}>
                  <Select
                    style={{ width: '180px' }}
                    dataSource={this.state.seconddata}
                    disabled
                    name="levelselect"
                  />
                </Col>
                <Col xxs={24} xs={12} l={5} style={styles.filterCol1}>
                  <label style={styles.filterTitleadd}>输入一级指标</label>
                  <IceFormBinder>
                    <Input name="yijizhibiao" />
                  </IceFormBinder>
                </Col>
                <Col xxs={24} xs={12} l={5} style={styles.filterCol1}>
                  <label style={styles.filterTitleadd}>输入权重</label>
                  <IceFormBinder>
                    <Input name="yijiweight" />
                  </IceFormBinder>
                </Col>
                <Col xxs={24} xs={12} l={5} style={styles.filterCol1}>
                  <label style={styles.filterTitleadd} disabled>输入描述</label>
                  <IceFormBinder>
                    <Input name="yijidescribe" />
                  </IceFormBinder>
                </Col>
                <Button
                  onClick={this.level1}
                  type="primary"
                  style={{ marginLeft: '10px' }}
                >
                  确认添加
                </Button>
              </Row>
            </div>
          </IceFormBinderWrapper>
        </IceContainer>
        <IceContainer title="二级指标添加">
          <IceFormBinderWrapper
            value={this.state.leveladddata2}
          >
            <div>
              <Row wrap>
                <Col xxs={24} xs={12} l={6} style={styles.filterCol1}>
                  <IceFormBinder name="selectlevel1">
                    <Select
                      style={{ width: '180px' }}
                      dataSource={this.state.seconddata}
                      placeholder="请选择一级指标"
                      name="selectlevel1"
                        // onChange={}
                    />
                  </IceFormBinder>
                </Col>
                <Col xxs={24} xs={12} l={5} style={styles.filterCol1}>
                  <label style={styles.filterTitleadd}>输入二级指标</label>
                  <IceFormBinder>
                    <Input name="erjizhibiao" />
                  </IceFormBinder>
                </Col>
                <Col xxs={24} xs={12} l={5} style={styles.filterCol1}>
                  <label style={styles.filterTitleadd}>输入权重</label>
                  <IceFormBinder>
                    <Input name="erjiweight" />
                  </IceFormBinder>
                </Col>
                <Col xxs={24} xs={12} l={5} style={styles.filterCol1}>
                  <label style={styles.filterTitleadd}>输入描述</label>
                  <IceFormBinder>
                    <Input name="erjidescribe" />
                  </IceFormBinder>
                </Col>
                <Button
                  onClick={this.level2}
                  type="primary"
                  style={{ marginLeft: '10px' }}
                >
                  确认添加
                </Button>
              </Row>
            </div>
          </IceFormBinderWrapper>
        </IceContainer>
        <IceContainer title="三级指标添加">
          <IceFormBinderWrapper
            value={this.state.leveladddata3}
          >
            <div>
              <Row wrap>
                <Col xxs={24} xs={12} l={6} style={styles.filterCol1}>
                  <IceFormBinder name="selectlevel2">
                    <Select
                      style={{ width: '180px' }}
                      dataSource={this.state.thirddata}
                      placeholder="请选择二级指标"
                      name="selectlevel2"
                    />
                  </IceFormBinder>
                </Col>
                <Col xxs={24} xs={12} l={5} style={styles.filterCol1}>
                  <label style={styles.filterTitleadd}>输入三级指标</label>
                  <IceFormBinder>
                    <Input name="sanjizhibiao" />
                  </IceFormBinder>
                </Col>
                <Col xxs={24} xs={12} l={5} style={styles.filterCol1}>
                  <label style={styles.filterTitleadd}>输入权重</label>
                  <IceFormBinder>
                    <Input name="sanjiweight" />
                  </IceFormBinder>
                </Col>
                <Col xxs={24} xs={12} l={5} style={styles.filterCol1}>
                  <label style={styles.filterTitleadd}>输入描述</label>
                  <IceFormBinder>
                    <Input name="sanjidescribe" />
                  </IceFormBinder>
                </Col>
                <Button
                  onClick={this.level3}
                  type="primary"
                  style={{ marginLeft: '10px' }}
                >
                  确认添加
                </Button>
              </Row>
            </div>
          </IceFormBinderWrapper>
        </IceContainer>
      </div>
    );
  }
}
const styles = {
  filterTableOperation: {
    lineHeight: '28px',
  },
  operationItem: {
    marginRight: '12px',
    textDecoration: 'none',
    color: '#5485F7',
  },
  titleWrapper: {
    display: 'flex',
    flexDirection: 'row',
  },
  title: {
    marginLeft: '10px',
    lineHeight: '20px',
  },
  paginationWrapper: {
    textAlign: 'right',
    paddingTop: '26px',
  },
  filterCol: {
    display: 'flex',
    alignItems: 'center',
    marginBottom: '20px',
    marginTop: '40px',
  },
  filterCol1: {
    display: 'flex',
    alignItems: 'center',
    marginBottom: '20px',
  },
  filterTitle: {
    width: '68px',
    textAlign: 'right',
    marginRight: '12px',
    fontSize: '14px',
  },
  filterTitleadd: {
    width: '100px',
    textAlign: 'right',
    marginRight: '12px',
    fontSize: '14px',
  },


  filterTool: {
    width: '200px',
  },

};
